// web/src/app/(employee)/_components/toolbar.tsx
'use client';

import React, {useEffect, useState} from "react";
import {useWorkspaceId} from "@/hooks/social/use-workspace-id";
import {Channel, Member, Workspace} from "@/lib/social/types";
import {useGetWorkspace} from "@/features/workspaces/api/use-get-workspace";
import {useGetChannels} from "@/features/channels/api/use-get-channels";
import {useGetMembers} from "@/features/members/api/use-get-members";
import {Button} from "@/components/ui/button";
import {Info, Search} from "lucide-react";
import {
    CommandDialog,
    CommandEmpty,
    CommandGroup,
    CommandInput,
    CommandItem,
    CommandList, CommandSeparator
} from "@/components/ui/command";
import Link from "next/link";
import {Input} from "@/components/ui/input";

const Toolbar = () => {
    // const [open, setOpen] = useState(false)
    const [value, setValue] = useState('')

    return (
        <nav className={`w-full flex items-center justify-between h-10 p-1.5`}>
            <div // 占位
                className={`flex-1`}
            />
            <div className={`p-2 gap-2 flex flex-row items-center bg-white rounded-md min-w-[280px]
             max-w-[642px] grow-[2] shrink`}>
                {/*<Button*/}
                {/*    onClick={() => setOpen(true)}*/}
                {/*    size={'sm'} className={`bg-accent/25 hover:bg-accent-25 w-full justify-start*/}
                {/*h-7 px-2`}>*/}
                {/*    /!*<span className={`text-white text-xs`}>搜索职位/公司</span>*!/*/}
                {/*</Button>*/}
                <Input
                    className={'border-black'}
                    onChange={(e) => setValue(e.target.value)}
                    value={value}
                    placeholder={`搜索职位/公司`}
                />
                <Link href={`/search?value=${value}`}>
                    <Search className={`cursor-pointer size-4 text-black mr-2`}/>
                </Link>
            </div>
            <div className={`ml-auto flex-1 flex items-center justify-end`}>
                <Button variant={'transparent'} size={"iconSm"}>
                    <Info className={`size-5 text-white`}/>
                </Button>
            </div>
        </nav>
    );
};

export default Toolbar;